@import url('~@/styles/animations.less');

.page {
    position: relative;
    height: 100vh;
    background: url('~@/assets/report/entry/bg.png') no-repeat center;
    background-size: cover;

    &_top {
        position: relative;
        // top: 112px;
        top: 13%;
        z-index: 999;
        display: flex;
        flex-direction: column;
        gap: 16px;
        margin: 0 30px;

        .orgTitle {
            display: flex;
            align-items: center;
            color: #fff;
            font-size: 18px;

            .logo {
                width: 34px;
                height: 24px;
                background: url('~@/assets/logo.png') no-repeat center;
                background-size: contain;
            }
        }

        .mainTitle {
            width: 315px;
            height: 80px;
            margin: 0 auto;
            background: url('~@/assets/report/entry/title.png') no-repeat center;
            background-size: contain;
        }

        .arrowSign {
            position: absolute;
            top: 102px;
            left: 80px;
            width: 60px;
            height: 41px;
            background: url('~@/assets/report/entry/arrow.png') no-repeat center;
            background-size: contain;
        }
    }

    .bigStuff {
        .bounce-down();

        position: absolute;
        // top: 364px;
        top: 44%;
        right: 3px;
        width: 181px;
        height: 181px;
        background: url('~@/assets/report/entry/stuff_big.png') no-repeat center;
        background-size: contain;
    }
    .smallStuff {
        .bounce-down(2s, 0.5s);

        position: absolute;
        // top: 318px;
        top: 39%;
        left: 39px;
        width: 66px;
        height: 62px;
        background: url('~@/assets/report/entry/stuff_small.png') no-repeat center;
        background-size: contain;
    }

    .bottomPng {
        position: absolute;
        bottom: 0;
        width: 100%;
        height: 560px;
        background: url('~@/assets/report/entry/png_bottom.png') no-repeat center;
        background-size: contain;
    }

    &_bottom {
        position: absolute;
        // bottom: 50px;
        bottom: 6%;
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;

        .openBtn {
            .pulsate-bck();

            width: 343px;
            height: 58px;
            background: url('~@/assets/report/entry/button.png') no-repeat center;
            background-size: contain;
        }

        .privacy {
            margin-top: 16px;
        }

        :global {
            .adm-checkbox-icon {
                width: 16px;
                height: 16px;
            }
        }

        .tips {
            margin-top: 16px;
            color: rgba(255, 255, 255, 0.65);
            font-size: 12px;
            text-align: center;
        }
    }
}
